#{extends 'template.html'/}


<body>


 #{include 'main.html'/}    
     
<br><br><br><br>
<center><div  class="container command_center">

 #{include 'panelperfil.html'/}    
		  
		  
		  <div class="row primeiraLinha">
			
			
	
 
    <br><br><br> 
    

    
     <!-- Emails -->
  
   <div class="row">
          <div class="col-lg-8">
            <div class="panel">
              <div class="panel-heading">
                <h3 class="panel-title"><i class="icon-long-arrow-right"></i>Experiencias</h3>
              </div>
              <div class="panel-body">
                <table class="table table-hover">
     <thead>
     <tr >
     <th>Titulo</th>
     <th>Categoria</th>
     <th>Publicado</th>
      #{if user?.spe_role == 'gestor'}
     <th>Publicar</th>
      #{/if}
     </tr>

</thead>
<tbody>
 #{list items:experiencias, as:'exp'} 
   
     <tr>
     <td>
  		<a href="@{Speakrs.cadastrar(exp)}" >${exp.exp_titulo} <img id="ctl00_XXX" src="${exp?.exp_caminho_ima_home}" width='30' height='30' style="border: 0; float: left; margin-right: 15px" /></a>
  	 </td>
  	  <td>
  		<a href="" >${exp.exp_categoria} </a>
  	 </td>
  	 <td>
  		<span class="${exp.exp_estado_publicado =~ "sim" ? 'label label-success' : 'label label-warning'}">${exp.exp_estado_publicado} </span>
  	 </td>
  	  #{if user?.spe_role == 'gestor'}
  	 <td>
  	 	<a href=""  data-toggle="tooltip" title="Altere as configurações do seu projeto">Publicar</a>
  	 </td>
  	 #{/if}
  	 </tr>
  	  #{/list}
  	
  	 </tbody>
  		</table>
              </div>
            </div>
          </div>
         
                
        </div><!-- /.row -->
        

    
    
    <div class="row ">
			  
			  
			  <div class="col-md-12 legendaTxt">
				  
				  
				  <h1 class="tituloContHome">Cadastro de Experiencias</h1>
				  

				  
				  
			  </div><!-- /col-md-12 -->
			  
			  
		  </div><!-- / row -->
 
 #{form @Experiencias.cadastrarExperiencia(), enctype:'multipart/form-data'} 				 	
		 <div class="form-group ">
		 
		 <input  class="form-control"   type="hidden" name="experiencia.exp_speakr" value="${user?.spe_nome}">
		 <input  class="form-control"   type="hidden" name="experiencia.spe_codigo" value="${user?.spe_codigo}">
		 <input  class="form-control"   type="hidden" name="experiencia.exp_ima_speakr" value="${user?.spe_caminho_ima}">
		 <table>
<tr>
	<td> 
		 
		    <h3 class="subTituloContHome">Imagem de Background:</h3><img id="uploadPreview1" width='100' height='100' src="@{'/public/images/no_image.jpg'}" /><br />
		<input id="uploadImage1" type="file" name="experiencia.exp_ima" onchange="PreviewImage(1);" />
		</td>
     <td>
       <h3 class="subTituloContHome">Imagem da Home:</h3><img id="uploadPreview1" width='100' height='100' src="@{'/public/images/no_image.jpg'}" /><br />
		<input id="uploadImage1" type="file" name="experiencia.exp_ima_home" onchange="PreviewImage(1);" />
      </td>
     </tr>
</table>
 <br> <input class="form-control msgInput" id="exampleInputEmail1" placeholder="Titulo da experiencia" type="text" name="experiencia.exp_titulo" size="16" value="${experiencia?.exp_titulo}"> 
  
  <br> <input class="form-control msgInput" id="exampleInputEmail1" placeholder="Descrição da experiencia" type="text" name="experiencia.exp_descricao" size="16" value="${experiencia?.exp_descricao}"> 
           
 <br> <input class="form-control msgInput" id="exampleInputEmail1" placeholder="Resumo"  name="experiencia.exp_resumo" size="16" value="${experiencia?.exp_resumo}">
 
 <br> <input class="form-control msgInput" id="exampleInputSpeakr" placeholder="Speakr"  name="experiencia.exp_speakr" size="16" value="${experiencia?.exp_speakr}">
 
 <br> <input  class="form-control msgInput" id="exampleInputEmail1" placeholder="Preço" type="text" name="experiencia.exp_preco" size="16" value="${experiencia?.exp_preco}"> 
              <span class="error">${erro}</span>
   
     <h4>Categoria</h4>
    	<select class="form-control" name="experiencia.exp_categoria">
          <option>Gastronomia</option>
          <option>Esporte</option>
          <option>Cultura</option>
      </select>
   
   <h4>País</h4>
    	<select class="form-control" name="experiencia.exp_pais">
          <option>Brasil</option>
          <option>França</option>
          <option>Espanha</option>
          <option value="Estados Unidos">Estados Unidos</option>
      </select>
      
      
  <br> <input class="form-control msgInput" id="exampleInputEmail1" placeholder="Link Video Youtube"  name="experiencia.exp_link_youtube" size="16" value="${experiencia?.exp_link_video}">
  
  <table>
<tr>
	<td>
		<img id="uploadPreview1" width='100' height='100' src="@{'/public/images/no_image.jpg'}" /><br />
		<input id="uploadImage1" type="file" name="p1" onchange="PreviewImage(1);" />
	</td>
	<td>
		<img id="uploadPreview2" width='100' height='100' src="@{'/public/images/no_image.jpg'}" /><br />
		<input id="uploadImage2" type="file" name="p2" onchange="PreviewImage(2);" />
	</td>
	<td>
		<img id="uploadPreview3" width='100' height='100' src="@{'/public/images/no_image.jpg'}" /><br />
		<input id="uploadImage3" type="file" name="p3" onchange="PreviewImage(3);" />
	</td>
	<td>
		<img id="uploadPreview4" width='100' height='100' src="@{'/public/images/no_image.jpg'}" /><br />
		<input id="uploadImage4" type="file" name="p4" onchange="PreviewImage(4);" />
	</td>	
</tr>
</table>
		
<script type="text/javascript">
    function PreviewImage(no) {
        var oFReader = new FileReader();
        oFReader.readAsDataURL(document.getElementById("uploadImage"+no).files[0]);

        oFReader.onload = function (oFREvent) {
            document.getElementById("uploadPreview"+no).src = oFREvent.target.result;
        };
    }
</script>
  
  
  
     <br> <input class="form-control msgInput" id="exampleInputEmail1" placeholder="Estado"  name="experiencia.exp_estado" size="16" value="${experiencia?.exp_estado}"> 
            
		<br><input class="form-control msgInput" id="exampleInputEmail1" placeholder="Cidade"  type="text" size="26" value="${experiencia?.exp_cidade}" name="experiencia.exp_cidade"> 
    <p class="buttons">
        <input class="btn btn-primary"  type="submit" value="Registrar"> <a href="@{Application.index()}">Cancelar</a>
    </p>
    </div>
 #{/form}
    
 <a href="" ></a>
    </div></div></div>
    
     
     


  
  
 
                
                
                
                
                
                
                
                
                
  		
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
     <script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
    </body>
  
</html>